<h3>1.描述</h3>
<p>动态变更测试</p>
<h3>2.示例</h3>
<div class="anchor-box">
  <h4>id：{{itemId}}</h4>
  <ti-anchor [items]="items" [(anchorId)]="anchorId" [offsetTop]="offsetTop" (anchorIdChange)="onChange($event)"></ti-anchor>
  <h4>更改anchorId</h4>
  <br />
  <button (click)="changeanchorId()">跳转到Pod列表</button><br /><br />
  <h4>更改offsetTop</h4>
  <br />
  <button (click)="changeOffsetTop()">offsetTop设置为0</button>
</div>
<div class="right-content">
  <h1 id="{{items[0].id}}">概览</h1>
  <div style="height: 500px; background: seashell">
    <p>概览 Content</p>
  </div>
  <h1 id="{{items[1].id}}">Pod列表</h1>
  <div style="height: 300px; background: lightgoldenrodyellow">
    <p>Pod列表 Content</p>
  </div>
  <h1 id="{{items[2].id}}">容器配置</h1>
  <div style="height: 800px; background: lawngreen">
    <p>容器配置 Content</p>
  </div>
  <h1 id="{{items[3].id}}">访问配置</h1>
  <div style="height: 600px; background: yellowgreen">
    <p>访问配置 Content</p>
  </div>
  <h1 id="{{items[4].id}}">配置Pod</h1>
  <div style="height: 1000px; background: skyblue">
    <p>配置Pod Content</p>
  </div>
  <h1 id="{{items[5].id}}">事件</h1>
  <div style="height: 200px; background: deepskyblue">
    <p>事件 Content</p>
  </div>
  <h1 id="{{items[6].id}}">历史版本</h1>
  <div style="height: 200px; background: lightsalmon">
    <p>历史版本 Content</p>
  </div>
  <h1 id="{{items[7].id}}">Container Configuration</h1>
  <div style="height: 1200px; background: coral">
    <p>Container Configuration Content</p>
  </div>
</div>
